﻿<template>
    <div class="ChangeWireropeDetail">
        <MyDialog :model-value="true" :type="DialogType.C3" :title="title" @close="onClose">
            <el-form ref="ChangeWireropeDetailFormRef" label-width="110" :model="thisData" :rules="rules">
                <div class="rowTitle marb-10">旧绳信息</div>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="旧绳编码" prop="oldCode">
                            <el-input v-model="thisData.oldCode" disabled maxlength="50">
                                <template #append v-if="!isSee">
                                    <el-button @click="onOpenWireropeSelect('旧绳')">
                                        <el-icon>
                                            <Search />
                                        </el-icon>
                                    </el-button>
                                </template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="旧绳名称" prop="oldName">
                            <el-input v-model="thisData.oldName" maxlength="200" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="规格型号" prop="guiGe">
                            <el-input v-model="oldData.guiGe" maxlength="200" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="直径" prop="diameter">
                            <InputNumber v-model="oldData.diameter" :disabled="true" append="mm"></InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="公称捻距" prop="nianJu">
                            <InputNumber v-model="oldData.nianJu" :disabled="true" append="mm"> </InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="长度" prop="lengthNum">
                            <InputNumber v-model="oldData.lengthNum" :disabled="true"></InputNumber>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="绳子条数" prop="cnt">
                            <InputNumber v-model="oldData.cnt" :precision="0" :disabled="true"></InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="抗拉强度" prop="mpaID">
                            <DataSelect table="Mpa" class="w-100" v-model:id="oldData.mpaID" v-model:name="oldData.mpaName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="表面状态" prop="surfaceStatusID">
                            <DataSelect table="SurfaceStatus" class="w-100" v-model:id="oldData.surfaceStatusID" v-model:name="oldData.surfaceStatusName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="捻制类型" prop="twistingTypeID">
                            <DataSelect table="TwistingType" class="w-100" v-model:id="oldData.twistingTypeID" v-model:name="oldData.twistingTypeName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="矿山" prop="departmentID">
                            <DataSelect table="Department" class="w-100" :filter="{ _Type: Enums.Department_Type.矿山 }" v-model:id="oldData.departmentID" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="安装日期" prop="installDate">
                            <el-date-picker class="w-100" v-model="oldData.installDate" type="date" :disabled="true" />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="安装长度" prop="installLengthNum">
                            <InputNumber v-model="oldData.installLengthNum" append="m" :disabled="true"></InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="安装地点" prop="installAddressID">
                            <DataSelect table="InstallAddress" class="w-100" label="addressInfo" v-model:id="oldData.installAddressID" v-model:name="oldData.installAddressName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="提升机类型" prop="hoisterID">
                            <DataSelect table="Hoister" class="w-100" v-model:id="oldData.hoisterID" v-model:name="oldData.hoisterName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="提升机用途" prop="hoisterUsageID">
                            <DataSelect ref="HoisterUsageRef" table="HoisterUsage" class="w-100" v-model:id="oldData.hoisterUsageID" v-model:name="oldData.hoisterUsageName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="钢丝绳类型" prop="wireropeTypeID">
                            <DataSelect ref="WireropeTypeRef" table="WireropeType" class="w-100" v-model:id="oldData.wireropeTypeID" v-model:name="oldData.wireropeTypeName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="主要负责人" prop="linkUser">
                            <el-input v-model="oldData.linkUser" maxlength="50" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="负责人电话" prop="linkPhone">
                            <el-input v-model="oldData.linkPhone" maxlength="20" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="16">
                        <el-form-item label="备注" prop="remark">
                            <el-input v-model="oldData.remark" maxlength="500" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <div class="rowTitle marb-10">新绳信息</div>

                <el-row>
                    <el-col :span="8">
                        <el-form-item label="新绳编码" prop="newCode">
                            <el-input v-model="thisData.newCode" maxlength="50" disabled>
                                <template #append v-if="!isSee">
                                    <el-button @click="onOpenWireropeSelect('新绳')">
                                        <el-icon>
                                            <Search />
                                        </el-icon>
                                    </el-button>
                                </template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="新绳名称" prop="newName">
                            <el-input v-model="thisData.newName" maxlength="200" :disabled="isSee"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="规格型号" prop="guiGe">
                            <el-input v-model="newData.guiGe" maxlength="200" :disabled="true"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="直径" prop="diameter">
                            <InputNumber v-model="newData.diameter" :disabled="true" append="mm"></InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="长度" prop="lengthNum">
                            <InputNumber v-model="newData.lengthNum" :disabled="true"></InputNumber>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="绳子条数" prop="cnt">
                            <InputNumber v-model="newData.cnt" :precision="0" :disabled="true"></InputNumber>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="抗拉强度" prop="mpaID">
                            <DataSelect table="Mpa" class="w-100" v-model:id="newData.mpaID" v-model:name="newData.mpaName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="表面状态" prop="surfaceStatusID">
                            <DataSelect table="SurfaceStatus" class="w-100" v-model:id="newData.surfaceStatusID" v-model:name="newData.surfaceStatusName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="捻制类型" prop="twistingTypeID">
                            <DataSelect table="TwistingType" class="w-100" v-model:id="newData.twistingTypeID" v-model:name="newData.twistingTypeName" :disabled="true"></DataSelect>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="8">
                        <el-form-item label="安装日期" prop="installDate">
                            <el-date-picker class="w-100" :disabled-date="installDateDisabledDate" v-model="thisData.installDate" type="date" :disabled="isSee" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="出库日期" prop="outStockDate">
                            <el-date-picker class="w-100" :disabled-date="installDateDisabledDate" v-model="thisData.outStockDate" type="date" :disabled="isSee" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="下次检测日期" prop="nextCheckDate">
                            <el-date-picker class="w-100" v-model="thisData.nextCheckDate" type="date" :disabled="isSee" />
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="8">
                        <el-form-item label="换绳原因" prop="reason">
                            <el-input v-model="thisData.reason" maxlength="500" :disabled="isSee"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="16">
                        <el-form-item label="备注" prop="remark">
                            <el-input v-model="newData.remark" maxlength="500" :disabled="isSee"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="8">
                        <el-form-item label="挂绳前试验报告" prop="laNiu_Files">
                            <ButtonImage v-model="thisData.laNiu_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="挂绳前无损报告" prop="qianWuSun_Files">
                            <ButtonImage v-model="thisData.qianWuSun_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="挂绳后无损报告" prop="houWuSun_Files">
                            <ButtonImage v-model="thisData.houWuSun_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="8">
                        <el-form-item label="出厂报告" prop="chuChang_Files">
                            <ButtonImage v-model="thisData.chuChang_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="验收报告" prop="yanShou_Files">
                            <ButtonImage v-model="thisData.yanShou_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="倒卷检测报告" prop="jianCe_Files">
                            <ButtonImage v-model="thisData.jianCe_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="附件" prop="attr_Files">
                            <ButtonImage v-model="thisData.attr_FilesList" appendToBody :readonly="isSee" type="warning" :text="isSee ? '查看' : '上传'"></ButtonImage>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>

            <StockSelect v-if="isShowStockSelect" :hasCheckbox="false" :hasRadio="true" @close="onCloseStockSelect" :defaultFilter="{ _IsOut: false, _IsSelect: true }"></StockSelect>
            <UsingWireropeSelect v-if="isShowUsingWireropeSelect" :hasCheckbox="false" :hasRadio="true" @close="onCloseUsingWireropeSelect"></UsingWireropeSelect>

            <template #footer>
                <el-button type="primary" :loading="loading" @click="onSave" v-if="!isSee">提交</el-button>
            </template>
        </MyDialog>
    </div>
</template>

<script lang="ts" setup>
import Enums from "@/gx/Enums";
import Gx from "@/gx/Gx";
import { FormRules } from "element-plus";
import { DialogType } from "@/_gx/TsEnums";
import StockSelect from "@/views/wb/Stock/StockSelect.vue";
import UsingWireropeSelect from "@/views/wi/UsingWirerope/UsingWireropeSelect.vue";

//接收父组件的传值
const rowAutoID = inject("rowAutoID") as Ref<number | null>;

//定义当前页面数据对象
const thisData = ref<any>({});
const oldData = ref<any>({});
const newData = ref<any>({});

//loading...
const loading = ref(false);

//定义表单验证规则
const rules = ref<FormRules>({
    oldCode: [{ required: true, message: "请输入旧绳编码", trigger: "change" }],
    oldName: [{ required: true, message: "请输入旧绳名称", trigger: "blur" }],
    newCode: [{ required: true, message: "请输入新绳编码", trigger: "change" }],
    newName: [{ required: true, message: "请输入新绳名称", trigger: "blur" }],
    reason: [{ required: true, message: "请输入换绳原因", trigger: "blur" }],
    installDate: [{ required: true, message: "请选择安装日期", trigger: "blur" }],
    outStockDate: [{ required: true, message: "请选择出库日期", trigger: "blur" }],
    nextCheckDate: [{ required: true, message: "请选择下次检测日期", trigger: "blur" }],
});

//安装日期限制
const installDateDisabledDate = (time) => {
    if (time.getTime() > Date.now()) {
        return true;
    } else {
        return false;
    }
};

//标题
const title = computed(() => {
    if (Gx.IsEmpty(rowAutoID.value)) {
        return "换绳详情 - 创建";
    } else {
        return `换绳详情 - 编辑 - ${thisData.value.code}`;
    }
});

//查看
const isSee = ref(false);

//初始化
const Init = (type) => {
    if (type == "查看") {
        isSee.value = true;
    }
    if (!Gx.IsEmpty(rowAutoID.value)) {
        App.CallApi(Api.ChangeWirerope.GetByID(rowAutoID.value), {
            success: (res) => {
                thisData.value = res;
                oldData.value = res.oldUsingWireropeModel;
                newData.value = res.newUsingWireropeModel;
                thisData.value.nextCheckDate = res.newUsingWireropeModel.nextCheckDate;
                thisData.value.outStockDate = res.newUsingWireropeModel.outStockDate;
                thisData.value.chuChang_FilesList = res.newUsingWireropeModel.chuChang_FilesList;
                thisData.value.yanShou_FilesList = res.newUsingWireropeModel.yanShou_FilesList;
                thisData.value.jianCe_FilesList = res.newUsingWireropeModel.jianCe_FilesList;
                thisData.value.attr_FilesList = res.newUsingWireropeModel.attr_FilesList;
            },
        });
    } else {
        thisData.value.installDate = Gx.FormatDate("YYYY-MM-DD");
        thisData.value.outStockDate = Gx.FormatDate("YYYY-MM-DD");
        newData.value.laNiu_FilesList = [];
        newData.value.qianWuSun_FilesList = [];
        newData.value.houWuSun_FilesList = [];
    }
};

//表单Ref对象
const ChangeWireropeDetailFormRef = ref(null);

//保存
const onSave = () => {
    ChangeWireropeDetailFormRef.value.validate((isOk: boolean) => {
        if (!isOk) {
            return;
        }

        // 赋值旧绳信息给新绳
        newData.value.departmentID = oldData.value.departmentID;
        newData.value.installLengthNum = oldData.value.installLengthNum;
        newData.value.installAddressID = oldData.value.installAddressID;
        newData.value.installAddressName = oldData.value.installAddressName;
        newData.value.hoisterID = oldData.value.hoisterID;
        newData.value.hoisterName = oldData.value.hoisterName;
        newData.value.hoisterUsageID = oldData.value.hoisterUsageID;
        newData.value.hoisterUsageName = oldData.value.hoisterUsageName;
        newData.value.wireropeTypeID = oldData.value.wireropeTypeID;
        newData.value.wireropeTypeName = oldData.value.wireropeTypeName;
        newData.value.linkUser = oldData.value.linkUser;
        newData.value.linkPhone = oldData.value.linkPhone;

        newData.value.outStockDate = thisData.value.outStockDate;
        newData.value.nextCheckDate = thisData.value.nextCheckDate;
        newData.value.chuChang_FilesList = thisData.value.chuChang_FilesList;
        newData.value.yanShou_FilesList = thisData.value.yanShou_FilesList;
        newData.value.jianCe_FilesList = thisData.value.jianCe_FilesList;
        newData.value.attr_FilesList = thisData.value.attr_FilesList;

        let _api = null;
        let _data = thisData.value;
        if (Gx.IsEmpty(rowAutoID.value)) {
            //添加
            _api = Api.ChangeWirerope.Insert;
        } else {
            //修改
            _api = Api.ChangeWirerope.Update;
        }
        _data.newUsingWireropeModel = newData.value;

        delete _data.newUsingWireropeModel.billModel;

        _data.code = "xxx";

        loading.value = true;
        App.CallApi(_api, {
            data: _data,
            success: (res) => {
                emits("close", true);
            },
            complete: () => {
                loading.value = false;
            },
        });
    });
};

/********************************************** 钢丝绳选择 **********************************************/
// 新绳
let isShowStockSelect = ref(false);
// 旧绳
let isShowUsingWireropeSelect = ref(false);

//打开钢丝绳选择
const onOpenWireropeSelect = (type) => {
    if (!isSee.value) {
        if (type == "旧绳") {
            isShowUsingWireropeSelect.value = true;
        } else {
            isShowStockSelect.value = true;
        }
    }
};
//关闭新绳选择
const onCloseStockSelect = (selectData) => {
    isShowStockSelect.value = false;
    if (!Gx.IsEmpty(selectData)) {
        thisData.value.newUsingWireropeID = selectData.autoID;
        thisData.value.newCode = selectData.code;
        thisData.value.newName = selectData.name;
        thisData.value.chuChang_FilesList = selectData.chuChang_FilesList;
        thisData.value.yanShou_FilesList = selectData.yanShou_FilesList;
        thisData.value.jianCe_FilesList = selectData.jianCe_FilesList;
        thisData.value.attr_FilesList = selectData.attr_FilesList;

        newData.value = selectData;
        newData.value.laNiu_FilesList = [];
        newData.value.qianWuSun_FilesList = [];
        newData.value.houWuSun_FilesList = [];
    }
};
//关闭旧绳选择
const onCloseUsingWireropeSelect = (selectData) => {
    isShowUsingWireropeSelect.value = false;
    if (!Gx.IsEmpty(selectData)) {
        thisData.value.oldUsingWireropeID = selectData.autoID;
        thisData.value.oldCode = selectData.code;
        thisData.value.oldName = selectData.name;
        oldData.value = selectData;
    }
};

//关闭
const onClose = () => {
    emits("close", false);
};

//向上抛出的事件与方法
const emits = defineEmits(["close"]);
defineExpose({ Init });
</script>
